<script setup lang="ts">

import { reactive } from 'vue'
import { templateList, templateRemove } from '@/api/system/generator/template'
import type { GeneratorTable, GeneratorTemplate } from '@/api/system/generator/generator'
import type { PageInfo, Result } from '@/tools/request'
import { Message, Modal } from '@arco-design/web-vue'


const template = reactive({
  queryForm: {} as GeneratorTemplate,
  pageInfo: {
    pageNum: 1,
    pageSize: 10
  } as PageInfo<GeneratorTemplate>,
  getTableList: (current: number = 1) => {
    templateList(template.queryForm, {
      pageNum: current,
      pageSize: template.pageInfo.pageSize
      //@ts-ignore
    }).then((resp: Result<PageInfo<GeneratorTemplate>>) => {
      console.log(resp)
      template.pageInfo = resp.data
    })
  },
  templateRemove: (record: GeneratorTemplate) => {
    Modal.confirm({
      title: '警告!',
      content: `确定删除 【${record.title}】 数据吗？`,
      onOk() {
        templateRemove(record.id).then(() => {
          Message.success('删除成功')
          template.getTableList()
        })
      }
    })
  }
})
template.getTableList()


</script>

<template>

  <a-breadcrumb class="my-3">
    <a-breadcrumb-item>系统工具</a-breadcrumb-item>
    <a-breadcrumb-item>模板管理</a-breadcrumb-item>
  </a-breadcrumb>
  <a-layout-content>
    <a-card>
      <template #title>
        模板管理
      </template>
      <a-form :model="template.queryForm" ref="searchFormRef" @submit="template.getTableList" label-align="left">
        <a-row :gutter="15" style="height: 32px" v-permission="'permission:generator:template:list'">
          <a-col :span="6">
            <a-form-item field="title" label="模板名">
              <a-input v-model="template.queryForm.title"></a-input>
            </a-form-item>
          </a-col>
          <a-divider direction="vertical" :margin="20" style="height: 32px"></a-divider>
          <a-col :span="6">
            <a-space>
              <a-button type="primary" html-type="submit">
                <template #icon>
                  <IconSearch />
                </template>
                搜索
              </a-button>
              <a-button @click="$refs.searchFormRef.resetFields()" type="secondary">
                <template #icon>
                  <IconRefresh />
                </template>
                重置
              </a-button>
            </a-space>
          </a-col>
        </a-row>
      </a-form>

      <a-divider :margin="16"></a-divider>
      <RouterLink to="/generator/template/form" v-permission="'permission:generator:template:create'">
        <a-button type="primary" class="mb-3">
          <template #icon>
            <IconPlus />
          </template>
          新建
        </a-button>
      </RouterLink>

      <a-table row-key="id" :data="template.pageInfo.list" :pagination="false">
        <template #columns>
          <a-table-column data-index="id" title="ID" align="center" width="80" />
          <a-table-column data-index="title" title="模板名" />
          <a-table-column data-index="createBy" title="创建人" />
          <a-table-column data-index="remark" title="备注" />
          <a-table-column data-index="createTime" title="创建时间" width="200" />
          <a-table-column data-index="updateTime" title="更新时间" width="200" />
          <a-table-column title="操作" width="240">
            <template #cell="{record}">
              <a-space>
                <RouterLink :to="{path: '/generator/template/form',query:{id: record.id}}"
                            v-permission="'permission:generator:template:update'">
                  <a-button type="text">修改</a-button>
                </RouterLink>
                <a-button type="text" @click="template.templateRemove(record)" class="text-danger"
                          v-permission="'permission:generator:template:delete'"
                >删除
                </a-button>
              </a-space>
            </template>
          </a-table-column>
        </template>
      </a-table>
      <div class="d-flex justify-content-end mt-2">
        <a-pagination :total="template.pageInfo.total" :page-size="template.pageInfo.pageSize"
                      :current="template.pageInfo.pageNum"
                      @change="template.getTableList" class="mt-3"></a-pagination>
      </div>
    </a-card>

  </a-layout-content>
</template>

<style scoped lang="scss">

</style>
